<template>
  <div>
    <el-dialog title="号码查询"
               :width="width"
               :before-close="handleClose"
               :visible.sync="handleResDialog">
      <el-form inline>
        <el-form-item>
          <el-input v-model="query.tell"
                    clearable
                    size="small"
                    placeholder="请输入号码"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini"
                     icon="el-icon-search"
                     @click="getHandleNum"
                     :loading="uploadLoading"
                     type="success"></el-button>
        </el-form-item>
      </el-form>
      <div v-if="handleResData.length > 0">
        <div v-for="(item, index) in handleResData"
             :key="index">
          <el-descriptions title="号码信息"
                           :columc="3"
                           size="mini"
                           border>
            <el-descriptions-item label="号码">{{item.tell}}</el-descriptions-item>
            <el-descriptions-item label="是否可办理">{{item.is_valid}}</el-descriptions-item>
            <el-descriptions-item label="渠道">{{item.chnl}}</el-descriptions-item>
            <el-descriptions-item label="办理人">{{item.handler_man}}</el-descriptions-item>
            <el-descriptions-item label="创建人姓名">{{item.nick_name}}</el-descriptions-item>
            <el-descriptions-item label="创建人工号">{{item.creator}}</el-descriptions-item>
            <el-descriptions-item label="反馈情况">{{item.res}}</el-descriptions-item>
            <el-descriptions-item label="是否冻结">{{item.is_freeze}}</el-descriptions-item>
            <el-descriptions-item label="是否兑换">{{item.is_convert}}</el-descriptions-item>
          </el-descriptions>

        </div>
      </div>
      <div v-else>
        <el-empty description="无数据"></el-empty>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getHandleNum } from '@/api/mng'
export default {
  name: 'HandleResNum',
  props: {
    handleResDialog: {
      type: Boolean,
      default: false
    },
    uuid: {
      type: String,
      require: true
    },
    width: {
      type: String,
      default: '100%'
    }
  },
  data() {
    return {
      query: { tell: '' },
      handleResData: [],
      uploadLoading: false
    }
  },
  methods: {
    handleClose() {
      this.query.tell = ''
      this.handleResData = []
      this.$emit('handleDialogClose', false)
    },
    getHandleNum() {
      if (this.query.tell === '' || this.query.tell === null) {
        this.$message.warning('请输入号码')
      } else {
        const params = {
          uuid: this.uuid,
          tell: this.query.tell
        }
        this.uploadLoading = true
        getHandleNum(params).then(res => {
          if (res.publicData.retInfo.retType === 0) {
            this.handleResData = res.data.results
            console.log(this.handleResData)
          }
          this.uploadLoading = false
        }).catch(e => {
          this.uploadLoading = false
          this.$notify.error('接口有误')
        })
      }
    },
  },
}
</script>

<style lang="scss" scoped>
</style>